<template>
	<view class="addList" :class="[list.length > 0? 'addList-back' : '']">
		<view class="addList-con addList-con-two" v-if="list.length <= 0">
			<!-- 没有地址列表 -->
			<view class="addList-noback">

			</view>
		</view>
		<view class="addList-con" v-else>
			<view class="addList-li" v-for="(item, index) of list" :key="index">
				<view class="addList-li-top font_blod">
					<text>{{item.addressName}}</text>
					<text>{{item.addressPhone}}</text>
				</view>
				<view class="addList-li-two">
					{{item.addressPrivinceName}}{{item.addressCityName}}{{item.addressDistrictName}}{{item.addressDetail}}
				</view>
				<view class="addList-li-three">
					<view class="addList-li-three-left flex">
						<image class="addList-li-three-img" v-if="item.isDefault == 1"
							src="https://www.zzzsyh.com/applets/agent/agent/address-1.png" mode=""></image>
						<image class="addList-li-three-img2" @click="setDefault(item.id)" v-else
							src="https://www.zzzsyh.com/applets/agent/agent/address-2.png" mode="">
						</image>
						<text class="addList-li-three-txt">设为默认地址</text>
					</view>
					<view class="addList-li-three-left-right flex">
						<view @click="cli_edit(item)"
							class="addList-li-three-left-right-btn addList-li-three-left-right-btn1">
							编辑
						</view>
						<view class="addList-li-three-left-right-btn" @click="cli_clear(item, index)">
							删除
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="addList-btn" @click="cli_add">
			添加收货地址
		</view>
		<!-- 弹窗 -->
		<view class="pop-box" v-if="show_pop">
			<view class="pop-box-main">
				<view class="pop-box-main-top">
					确定删除该地址？
				</view>
				<view class="pop-box-main-top-btm font_blod flex">
					<view class="pop-box-main-top-btm-left" @click="show_pop = false">
						取消
					</view>
					<view class="pop-box-main-top-btm-right" @click="delAgentAddress(id)">
						确定
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import allapi from '../api/index.js'
	import {
		eventBus
	} from '../../main.js'
	export default {
		data() {
			return {
				show_pop: false, // 删除弹窗
				agentId: uni.getStorageSync('agentId'),
				list: [],
				id: ''
			}
		},
		onShow() {
			this.getAgentAddressByAgentId()
		},
		mounted() {

		},
		methods: {
			// 点击选中地址
			cli_li(item) {
				// uni.redirectTo({
				//     url: '/pages/yuDing/yuDing?id_address=' + item.id
				// });
				eventBus.$emit('id_address', item.id)
				uni.navigateBack()
			},
			// 去新增地址
			cli_add() {
				uni.navigateTo({
					url: '/pages/addAddress/addAddress'
				});
			},
			// 去编辑地址
			cli_edit(item) {
				uni.navigateTo({
					url: '/pages/addAddress/addAddress?id=' + item.id
				});
			},
			// 设为默认地址
			setDefault(id) {
				let _that = this
				uni.request({
					url: allapi.setDefault,
					data: {
						agentId: this.agentId,
						id: id
					},
					success: (res) => {
						console.log(res);
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
						_that.getAgentAddressByAgentId()
					}

				})
			},
			// 删除收货地址
			cli_clear(item, index) {
				this.show_pop = true
				this.id = item.id
			},
			delAgentAddress(id) {
				let _that = this
				uni.request({
					url: allapi.delAgentAddress,
					data: {
						agentId: this.agentId,
						id: id
					},
					success: (res) => {
						console.log(res);
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
						_that.getAgentAddressByAgentId()
						this.show_pop = false
					}

				})
			},
			// 获取列表
			getAgentAddressByAgentId() {
				uni.request({
					url: allapi.getAgentAddressByAgentId,
					data: {
						agentId: this.agentId
					},
					success: (res) => {
						console.log(res);
						this.list = res.data.data
					}
				})
			},
		}
	}
</script>

<style scoped>
	.flex {
		display: flex;
		align-items: center;
	}

	.addList {
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		display: flex;
		flex-direction: column;
		/* background: #FFFFFF; */
	}

	.addList-back {
		background: none;
	}

	.addList-btn {
		margin: 10rpx 40rpx 10rpx;
		margin-bottom: calc(env(safe-area-inset-bottom) + 24rpx);
		height: 92rpx;
		line-height: 92rpx;
		text-align: center;
		background: linear-gradient(90deg, #2ACE52 0%, #1DC248 100%);
		border-radius: 46rpx;
		font-size: 36rpx;
		color: #FFFFFF;
	}

	.addList-con {
		flex: 1;
		overflow: auto;
		margin-bottom: 10rpx;
		
	}
	.addList-con-two {
		background: #FFFFFF;
	}
	.addList-noback {
		height: 876rpx;
		background-image: url('https://www.zzzsyh.com/applets/agent/agent/13.png');
		background-size: 100%;
		background-repeat: no-repeat;
	}

	.addList-li {
		padding: 24rpx 32rpx 34rpx;
		background: #FFFFFF;
		margin-top: 10rpx;
	}

	.addList-li-top {
		font-size: 32rpx;
		height: 44rpx;
		color: #333333;
		display: flex;
		justify-content: space-between;
	}

	.addList-li-two {
		line-height: 40rpx;
		font-size: 28rpx;
		font-weight: 400;
		color: #666666;
		margin-top: 24rpx;
		border-bottom: 2rpx solid #EEEEEE;
		padding-bottom: 24rpx;
	}

	.addList-li-three {
		height: 56rpx;
		display: flex;
		justify-content: space-between;
		margin-top: 24rpx;
	}

	.addList-li-three-img {
		width: 28rpx;
		height: 28rpx;
	}

	.addList-li-three-img2 {
		width: 32rpx;
		height: 32rpx;
	}

	.addList-li-three-txt {
		font-size: 24rpx;
		font-weight: 400;
		color: #666666;
		margin-left: 12rpx;
	}

	.addList-li-three-left-right-btn {
		font-size: 28rpx;
		width: 100rpx;
		height: 52rpx;
		line-height: 52rpx;
		text-align: center;
		background: #FAFAFA;
		border-radius: 8rpx;
		border: 2rpx solid #999999;
		color: #666666;
	}

	.addList-li-three-left-right-btn1 {
		margin-right: 34rpx;
	}

	.pop-box {
		position: absolute;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.5);
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.pop-box-main {
		width: 534rpx;
		height: 280rpx;
		background: #FFFFFF;
		border-radius: 16rpx;
	}

	.pop-box-main-top {
		height: 168rpx;
		line-height: 168rpx;
		font-size: 34rpx;
		color: #353535;
		text-align: center;
		border-bottom: 1rpx solid #EEEEEE;
	}

	.pop-box-main-top-btm {
		height: 110rpx;
		line-height: 110rpx;
		font-size: 34rpx;
	}

	.pop-box-main-top-btm-left {
		flex: 1;
		text-align: center;
		color: #000000;
		border-right: 1rpx solid #EEEEEE;
	}

	.pop-box-main-top-btm-right {
		flex: 1;
		text-align: center;
		color: #58D26F;
	}
</style>
